<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  
</head>
<body>
    <ul>
        <li>li01</li>
        <li>li02</li>
        <li>li03</li>
        <li>li04</li>
    </ul>
    <script>

        /* 
        声明的变量将具有以下三大特性：
            1.不能重复声明： 以let 声明的变量不能被再次声明，且被其它方式 声明的变量也不能被let 再次声明
            2.无变量提升：以let 声明的变量不能在变量声明前进行使用
            3.暂时时性死区：ES6为通过let声明的变量提供了块作用域的特性，被定义在块中的let变量只能在块中使用
         */

        let username="tom";
        console.log(username);
        // let username="alice";//报错，以let 声明的变量不能被再次声明
        // console.log(username);

        var age=30;
        // let age=70;//报错，被其它方式声明的变量也不能被let 再次声明
        console.log(age);

        let hobby="吃饭";
        hobby="睡觉";
        console.log(hobby);


        //使用let声明的变量不存在变量提升
        // console.log(hello);
        let hello="welcome";

        var lis=document.getElementsByTagName("li");//集合
        // for(var i=0;i<lis.length;i++){
        //     lis[i].onclick=function(){
        //         console.log("您点击了li"+i);
        //     };
        // }
        

        //暂时性死区
        for(let i=0;i<lis.length;i++){
            lis[i].onclick=function(){
                console.log("您点击了li"+i);
            };
        }

        //在块级作用域外面是访问不到let声明的i的
        console.log(i);

     /*    const声明的是一个只读的常量，一旦声明，常量的值就不能改变。
            不能重复声明： const 声明的变量不能被再次声明，且被其它方式声明的变量也不能被const 再次声明
            
            无变量提升：以const 声明的变量不能在变量声明前进行使用
            暂时性死区：ES6为通过const声明的变量提供了块作用域的特性，被定义在块中的const 变量只能在块中使用
            不能重复赋值：被const声明的变量不能再次赋值 */

            const num=100;
            // num=3000;
            console.log(num);

    </script>
</body>
</html>